<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!doctype html>
<html>
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<jsp:include page="../common/import.jsp" flush="true"></jsp:include>
<body>
<jsp:include page="../common/header.jsp" flush="true"></jsp:include>

<style type="text/css">
.none {
	display :none;
}
</style>


<div class="main p20">
	<div class="container clear">
        <ul class="left-nav fl pt20 w200">
            <li><a href="${base}/agent/agent/agentList.xhtml"><span class="iconfont">&#xf014d;</span>代理商</a></li>
            <li><a href="${base}/agent/sales/salesList.xhtml"><span class="iconfont">&#xf014d;</span>业务员</a></li>
            <li><a class="ahover" href="${base}/agent/merchant/merchantList.xhtml"><span class="iconfont">&#xf014b;</span>商户</a></li>
        </ul>
        
        <div class="main-right fr">
        	<div class="b m20 b-radius">
            	<div class="clear bgf5 bb">
                	<h2 class="fl h30 lg30 p5 pl10">商户</h2>
                	<c:if test="${user.type==1}">
                     <a href="javascript:" class="fr h20 p5 w100 m5 bg1eb9ef cfff b-radius tc" onclick="toOpen()"><span class="vm">开通商户平台</span></a>
                	</c:if>
                </div>
                <div id="searchDiv" class="p10" hidden="true">
                	<select id="searchType" class="b h30 lg30 w200">
                    	<option value="phone">商户手机号</option>
                        <option value="mcode">店铺编号(mcode)</option>
                    </select>
                    <input id="searchValue" class="w200 p5 h20" type="text">
                    <button class="h20 p5 bg1eb9ef cfff b-radius w50 vm" onclick="search()">搜索</button>
                </div>

                <p class="c999 h450 tc pt100 f30" id="noListDiv" hidden="true">暂无商户，赶快增加新商户吧~</p>
                <c:forEach items="${merchants}" var="merchant">
                	<%-- <c:if test="${merchant.stores.size() > 0}"> --%>
	                <div class="merchantList none">
		                <div class="clear p10 bgf5 bt h20 lg20">
		                    <div class="fl fb">商户：${merchant.mpUser.phone}</div>
		                    <c:if test="${user.type==1}">
		                    	<button class="fr caac81a" onclick="addStore('${merchant.qualificationId}')"><span class="iconfont f12">&#xf0175;</span>&nbsp;添加商铺</button>
		                    	</c:if>
		                </div>
		                <table class="w">
		                	<thead>
		                            <tr>
		                                <th class="w100">门店编号</th>
		                                <th class="w150">店铺</th>
		                                <th class="w150">行业</th>
		                                <th class="w250">地址</th>
		                                <th class="w100">店铺联系人</th>
		                                <th class="w112">跟进人</th>
		                                <th>操作</th>
		                            </tr>
		                        </thead>
		                </table>
		                <div class="max-h auto-y bb mb20">
		                    <table class="w">
		                        <tbody >
		                        	<c:forEach items="${merchant.stores}" var="store">
		                            <tr>
		                                <td class="w100">${store.mcode}</td>
		                                <td class="w150">${store.name}</td>
		                                <td class="w150">${store.bizClassify[0].name}</td>
		                                <td class="w250">${store.address.address_detail}</td>
		                                <td class="w100">${store.contactUser.name}</td>
		                                <td class="w112"><p>${store.salesName}</p>${store.salesPhone}</td>
		                                <td><a class="c1eb9ef" href="javascript:" onclick="toStoreInfo('${store.storeId}','${store.mcode}')">详情</a></td>
		                            </tr>
		                        	</c:forEach>
		                            
		                        </tbody>
		                    </table>
		                </div>
	                </div>
	                <%-- </c:if> --%>
                </c:forEach>
            </div>
               <div id="pagination" class="pagination fr"></div>
        </div>
       
    </div>
</div>
<input id="pageNo" hidden="true" value="1">
<input id="ms" type="hidden" value="${merchants}">
<jsp:include page="../common/footer.jsp" flush="true"></jsp:include>

<script type="text/javascript">
	//根据条件查询
	function search(){
		var searchType = $('#searchType').val();
		var searchValue = $('#searchValue').val();
		if (searchValue==null||searchValue=='') {
			alert("输入不能为空");
			return;
		}
		var domain = "${base}/agent/merchant/merchantList.xhtml";
		
		if (searchType=='mcode') {
			window.location.href=domain+"?mcode="+searchValue;
		}
		if(searchType=='phone'){
			window.location.href=domain+"?phone="+searchValue;
		}
		return;
		
	}

	//跳转到店铺详情界面
	function toStoreInfo(storeId,mcode){
		window.location.href="${base}/agent/store/storeInfo.xhtml?mcode="+mcode+"&storeId="+storeId;	
	}
	function toOpen(){
		window.location.href = "${base}/agent/merchant/toOpen.xhtml";
	}
	//跳转到新增店铺
	function addStore(qualificationId){
		window.location.href = "${base}/agent/store/toAdd.xhtml?qualificationId="+qualificationId;
	}
	
//分页页面实现
	$(function(){
		var ms =$('#ms').val();
		//alert(mList);
		var merNumOnPage = 3;
		if (ms!=null&&ms!='[]'&&ms!='') {
			$("#searchDiv").attr("hidden",false);
			$(".merchantList").each(function(e){
				var index = $(this).index()-3;
				//alert(index);
				$(this).addClass("page"+Math.floor(index/merNumOnPage));
			})
			$(".page0").removeClass("none");
			pageJs(parseInt($("#pageNo").val()),Math.ceil($(".merchantList").length/merNumOnPage));
		}else{
			$("#pagination").attr("hidden",true);
			$("#noListDiv").attr("hidden",false);
		}
	})
	
	function topage(pageNo) {
		$(".merchantList").addClass("none");
		$(".page"+(pageNo-1)).removeClass("none");
		$("#pageNo").val(pageNo);
		pageJs(parseInt($("#pageNo").val()),Math.ceil($(".merchantList").length/3));
	}
	
	
	function pageJs(pageNo, pageCount){
		var html = '';
		html += '<li><a onclick="topage(1)" style="cursor:pointer;">首页</a></li>';
		if(parseInt(pageNo) == 1) {
			html += '<li class="disabled"><a>&laquo;</a></li>';
		} else {
			html += '<li><a onclick="topage('+(parseInt(pageNo)-1)+')" style="cursor:pointer;">&laquo;</a></li>';
		}
		var no = 0;
	    for(var i=0; i<2; i++) {
	      	no = parseInt(pageNo) - (2-i);
	      	if(no > 0) {
		   		html += '<li onclick="topage('+no+')" style="cursor:pointer;"><span>'+no+'</span></li>';
	       	}
	   	}
		html += '<li class="active" onclick="topage('+parseInt(pageNo)+')" style="cursor:pointer;"><span>'+parseInt(pageNo)+'</span></li>';
		for(var i=1; i<11; i++) {
			no = parseInt(pageNo) + i;
			if(no > parseInt(pageCount)) {
				break;
			}
			if (no <= parseInt(pageCount)) {
				
				html += '<li onclick="topage('+no+')" style="cursor:pointer;"><span>'+no+'</span></li>';
			}
		}
	   	if(parseInt(pageNo) == parseInt(pageCount)) {
			html += '<li class="disabled"><a>&raquo;</a></li>';
	     } else {
			html += '<li><a onclick="topage('+(parseInt(pageNo)+1)+')" style="cursor:pointer;">&raquo;</a></li>';
	   	}
	   	html += '<li><a onclick="topage('+parseInt(pageCount)+')" style="cursor:pointer;">末页</a></li>';
	   	/* html += '<li><a>第<span class="text-danger">'+pageNo+'</span>页'; */
	    html += '<li><a>共<span class="text-danger">'+$(".merchantList").length+'</span>条记录,';
	    html += '<span class="text-danger">'+parseInt(pageCount)+'</span>页</a></li>';
	    
	   
		$("#pagination").html(html);
	}

</script>

</body>
</html>